var GENDER_MAP = {
    0: '未知',
    1: '男性',
    2: '女性'
}

new Vue({
    el: '#app',
    filters: {
        genderFilter(gender) {
            return GENDER_MAP[gender]
        }
    },
    data: function () {
        return {
            list: [
                {
                    id: 1,
                    name: 'Cary',
                    gender: 0,
                    createTime: ''
                }
            ],
            query: {
                name: '',
                gender: '',
            },
            pagination: {
                page: 1,
                pageSize: 20,
                total: 0
            },
            multipleSelection: [],
            dialogFormVisible: false,
            form: {
                name: '',
                gender: '0'
            },
            rules: {
                name: [{required: true, message: '用户名不能为空', trigger: 'blur'}]
            }
        }
    },
    methods: {
        loadData: function () {
            axios({
                method: 'post',
                url: '/v1/user/pages',
                data: {
                    name: this.query.name,
                    gender: this.query.gender,
                    page: this.pagination.page,
                    pageSize: this.pagination.pageSize,
                }
            }).then(resp => {
                if (apiErrorAndReturn(this, resp)) {
                    return;
                }
                console.log(resp.data)
                this.list = resp.data.data.records;
                this.pagination.total = resp.data.data.total;
                this.pagination.page = resp.data.data.current;
                this.pagination.pageSize = resp.data.data.size;
            }).catch(e => {
                console.error(e);
                this.$message.error(e.message);
            })
        },
        handleCurrentChange(val) {
            this.pagination.page = val
            this.loadData()
        },
        handleSelectionChange(val) {
            this.multipleSelection = val;
        },
        onClickAdd: function () {
            this.dialogFormVisible = true;
        },
        onClickAddSubmit: function () {
            this.$refs.userAddForm.validate((valid) => {
                if (valid) {
                    axios({
                        method: 'post',
                        url: '/v1/user/save',
                        data: this.form
                    }).then(resp => {
                        if (apiErrorAndReturn(this, resp)) {
                            return;
                        }
                        console.log(resp.data)
                        this.dialogFormVisible = false;
                        this.loadData()
                    }).catch(e => {
                        console.error(e);
                        this.$message.error(e.message);
                    })
                }
            })
        },
        onClickDelete: function () {
            var ids = this.multipleSelection.map(function (item) {
                return item.id
            })
            if (ids.length === 0) {
                return
            }
            this.$confirm('是否删除, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                axios({
                    method: 'post',
                    url: '/v1/user/delete',
                    data: {userIds: ids}
                }).then(resp => {
                    if (apiErrorAndReturn(this, resp)) {
                        return;
                    }
                    console.log(resp.data)

                    this.loadData()
                    this.$message({
                        type: 'success',
                        message: '删除成功!'
                    });
                }).catch(e => {
                    console.error(e);
                    this.$message.error(e.message);
                })
            }).catch(() => {
                this.$message({
                    type: 'info',
                    message: '已取消删除'
                });
            });
        }
    },
    mounted: function () {
        this.loadData();
    },
    created: function () {
    }
});